window.addEventListener('DOMContentLoaded', function () {
    // 验证用户名业务 verifyname
    let flag = true
    const reg1 = /^[\w\d-]{4,10}$/
    const username = document.querySelector('[name=username]')
    username.addEventListener('change', verifyname)
    function verifyname() {

        if (!reg1.test(username.value)) {
            username.nextElementSibling.innerHTML = '用户名格式不正确'
            return false
        }
        username.nextElementSibling.innerHTML = ''
        return true
    }
    // 验证手机号码业务 verifypwd
    const reg2 = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/
    const phone = document.querySelector('[name=phone]')
    phone.addEventListener('change', verifypwd)
    function verifypwd() {

        if (!reg2.test(phone.value)) {
            phone.nextElementSibling.innerHTML = '手机格式不正确'
            return false
        }
        phone.nextElementSibling.innerHTML = ''
        return true
    }
    // 密码验证verifypwd
    const reg4 = /^[\w\d]{6,18}$/

    const password = document.querySelector('[name=password]')
    password.addEventListener('change', verifypassword)
    function verifypassword() {
        if (!reg4.test(password.value)) {
            password.nextElementSibling.innerHTML = '密码格式不正确'
            return false
        }
        password.nextElementSibling.innerHTML = ''
        return true
    }

    const confirm = document.querySelector('[name=confirm]')
    confirm.addEventListener('change', verifyconfirm)
    function verifyconfirm() {
        if (confirm.value !== password.value) {
            confirm.nextElementSibling.innerHTML = '密码不一致'
            return false
        }
        confirm.nextElementSibling.innerHTML = ''
        return true
    }

    // 检查是否勾选同意
    const queren = document.querySelector('.icon-queren')
    queren.addEventListener('click', function () {
        queren.classList.toggle('icon-queren2')
    })

    const xtx_form = document.querySelector('.xtx-form')
    xtx_form.addEventListener('submit', function (e) {
        if (!queren.classList.contains('icon-queren2')) {
            e.preventDefault()
            alert('Please enter')
        }
        if (!verifypwd()) e.preventDefault()
        if (!verifyname()) e.preventDefault()
        if (!verifypassword()) e.preventDefault()
        if (!verifyconfirm()) e.preventDefault()


        // 点击之后存储本地
        const submit = document.querySelector('.submit')
        let data = []
        submit.addEventListener('click', function () {
            console.log(true);
            if (flag) {
                data.push({
                    username: `${username.value}`,
                    phone: `${phone.value}`,
                    password: `${password.value}`
                })
                console.log(data);
            } else {
                alert('Please enter123123')
            }
        })
        
    })
})